<!DOCTYPE html>
<html lang="cmn-Hans" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>我的关注</title>
    <link rel="stylesheet" th:href="@{/frame/layui/css/layui.css}">
    <link rel="stylesheet" th:href="@{/frame/flyres/css/global.css}">
</head>
<body>
<div th:replace="customer/top :: topBar"></div>
<div class="layui-container fly-marginTop fly-user-main">
    <div th:replace="customer/left :: leftBar"></div>
    <div class="fly-panel fly-panel-user" pad20 style="background-color: rgb(215,215,215);padding-top: 15px;">
        <div class="layui-row layui-col-space15">
                <div class="layui-card" th:each="item : ${cared.list}">
                    <div class="layui-card-body">
                        <div class="layui-row">
                            <div class="layui-col-md8">
                                <a class="fly-nav-avatar" th:href="@{'/customer/home?uid='+${item.other.phone * 6}}">
                                    <img th:src="@{'/picture/getAvatar?fileName='+${item.other.avatar}}"/>
                                    [[${item.other.username}]]
                                </a>
                            </div>
                            <div class="layui-col-md4" style="text-align: right">
                                <button class="layui-btn layui-btn-normal" th:onclick="'removeCare('+${item.other.phone * 6}+')'">取消关注</button>
                            </div>
                        </div>
                    </div>
                </div>
            <div class="layui-card">
                <div class="layui-card-body" align="center">
                    <div id="test1"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<script th:src="@{/frame/layui/layui.js}"></script>
<script>
    layui.cache.page = 'user';
    layui.cache.user = {
        username: '游客'
        ,uid: -1
        ,avatar:'[[@{/frame/flyres/images/avatar/00.jpg}]]'
        ,experience: 83
        ,sex: '男'
    };
    layui.config({
        version: "3.0.0"
        ,base:'/frame/flyres/mods/'
    }).extend({
        fly: 'index'
    }).use(['fly', 'element', 'laypage'],function () {
        const $ = layui.$;
        const laypage = layui.laypage;
        $(function () {
            $('#leftbar li').eq(2).addClass('layui-this');
        });

        laypage.render({
            elem: 'test1' //注意，这里的 test1 是 ID，不用加 # 号
            , count:[[${cared.total}]] //数据总数，从服务端得到
            , curr:[[${cared.pageNum}]]
            , limit: [[${cared.pageSize}]]
            , limits: [5, 10, 20, 30, 40, 50]
            , layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
            , jump: function (obj, first) {
                if (!first) {
                    location.href = '[[@{/care/showCare}]]?index=' + obj.curr + '&pageSize=' + obj.limit;
                }
            }
        });

        window.removeCare=function (other) {
            $.post('[[@{/care/removeCare}]]',{other:other},function (res) {
                location.reload();
            });
        }
    });
</script>
</body>
</html>